<html>
<meta charset='utf8'/>
<style type="text/css">
  #show{
  width:350px;
  height:200px;
  border:1px solid red;
  overflow-y:auto;
  }


</style>
<body>
<div style="margin:5 500">
<h3>实时聊天系统</h3>

<div id='show'></div>
<div style="margin-top:50px">
<textarea name="" rows="5" cols="47"></textarea>

</div><br />
<div>
<input type="submit" value="发送">
</div>
</div>
</body>
</html>
<script src="jq.js"></script>
<script type="text/javascript">
$(function(){
$(":submit").click(function(){

pull()
})

sub();
})


//接受消息
function sub(){
$.ajax({
   type: "POST",
   url: "sub.php",
   success: function(msg){
	   var date='<p>&nbsp;&nbsp;&nbsp;&nbsp;'+msg+'</p>';
	  if(msg!=""){
       $('#show').append(date)
	   
	   sub();
      $('#show').scrollTop($('#show')[0].scrollHeight);
	  }
   }
});


}

//发送消息
function pull(){
var date=$('textarea').val()
$.ajax({
   type: "POST",
   url: "pull.php",
   data: "date="+date,
   success: function(msg){
     
   }

});
$('textarea').val('')

}

</script>